<template>
  <!--fix-top-->
  <view class="pt-12 pb-16">

    <view class="fix-top h-12 bg-white" @click="jumpFanBase">
      <view class="px-4 h-full flex items-center justify-between">
        <view>手动同步到新表</view>
        <image class="w-4 h-4" src="@/static/image/rt.png"></image>
      </view>
    </view>

    <view class="px-4">
      <view class="flex gap-4 items-center justify-between bg-white rounded-lg px-4 py-2 mt-4" v-for="item in fanList">
        <view>
          <view class="text-sm">微信号: jsyg1788</view>
          <view class="text-xs text-gray-400">描述: {{ item.desc }}</view>
        </view>
        <view>
          <image class="w-10 h-10" src="http://zhiyi.p.qujiaba.com/uploads/store/comment/20240829/9d3788e04576665d4c9eff3acf12a206.jpg"></image>
        </view>
      </view>
    </view>

    <view class="packetBtn flex items-center justify-center w-36 h-10 bg-indigo-500 rounded-3xl text-white fixed bottom-4" @click="jumpBase">添加粉丝群</view>
  </view>
</template>

<script setup lang="ts">
  import { ref, onMounted } from "vue";
  import { userFansChatListApi } from '@/api/fan'
  import { onShow, onReady, onReachBottom } from "@dcloudio/uni-app";
  onShow(() => {
    // getFanList()
    uni.$off('update')
    uni.$on('update', function (data) {
      console.log('data===', data)
      data.status && getFanList()
    })
  })

  onMounted(() => {
    getFanList()
  })

  const fanList = ref<any[]>([])
  const fanTotal = ref<number>(0)

  const queryParams = ref({
    page: 1,
    limit: 10
  })

  /** 获取粉丝列表 **/
  const getFanList = async() => {
    // const resList = await loadList( userFansChatListApi, { page: 1, limit: 10 } )
    // fanList.value = resList
    // console.log('resList===', resList)

    const res = await userFansChatListApi( queryParams.value )
    fanTotal.value = res.data.total
    fanList.value = [...fanList.value, ...res.data.data]
  }

  /** 封装--加载列表/更多 **/
  const loadList = async (fn, pageQuery) => {
    console.log('pageQuery====', pageQuery)

    let isMore = false // 是否加载完毕
    if(isMore) return
    const { data: { data, total } } = await fn(pageQuery)
    if(Number(pageQuery.page) * Number(pageQuery.limit) >= total) {
      isMore = true
    }

    return data

    // console.log('fn===', fn)
    // const res = await fn()
  }

  /** 滚动加载更多 **/
  onReachBottom(() => {
    // console.log('123', fanList.value.length)
    // queryParams.value.page += 1
    // loadList(userFansChatListApi, queryParams.value )

    if(fanList.value.length < fanTotal.value) {
      queryParams.value.page += 1
      getFanList()
    }
  })

  /** 添加粉丝群-btn **/
  const jumpFanBase = () => {
    fanList.value = []
    queryParams.value.page = 1
    uni.navigateTo({ url: '/pages/fan/fanBase' })
  }


  const jumpBase = () => {
    // uni.navigateBack({ delta: 1 })
    const pages = getCurrentPages();
    console.log(pages,'222')
  }

</script>

<style scoped lang="scss">
page {
  min-height: 100vh;
  background: #f5f5f5;
}

.fix-top {
  position: fixed;
  z-index: 99;
  width: 100%;
  top: 0;
}

.packetBtn {
  left: 50%;
  transform: translateX(-50%);
}
</style>
